Getting images byte[] from MS SQLServer through WCF to Ionic3 Angular4

Image

So , that was quite a challenge.

After saving the images as byte[] pretty neat through the MVC client into the MS SqlServer , I wanted to get them into the app of Ionic3 with Angular4 ..

 

The problem was –

Well there were several problems –

1. How to return the data through the http without loosing data in “translation” on the way ?

Solution is in C# WCF before returning it convert to base64 – it will send the data intact through the www traffic.

dto.Logo = Convert.ToBase64String(dal.Logo);

       2.   When we get the data – we need to translate it into the image again :

this post helped me –  Search for the comment with 400 upvotes!

So, in my ts client side – my Ionic3 Angular4 baby ,  I added a function translating the byte[] into a Blob.

A Blob object represents a file-like object of immutable, raw data. Blobs represent data that isn’t necessarily in a JavaScript-native format. The File interface is based on Blob, inheriting blob functionality and expanding it to support files on the user’s system.

b64toBlob(b64Data, contentType, sliceSize) {
contentType = contentType || ”;
sliceSize = sliceSize || 512;

let byteCharacters = atob(b64Data);
let byteArrays = [];

for (let offset = 0; offset < byteCharacters.length; offset += sliceSize) {
let slice = byteCharacters.slice(offset, offset + sliceSize);

let byteNumbers = new Array(slice.length);
for (let i = 0; i < slice.length; i++) {
byteNumbers[i] = slice.charCodeAt(i);
}

let byteArray = new Uint8Array(byteNumbers);

byteArrays.push(byteArray);
}

let blob = new Blob(byteArrays, {type: contentType});
return blob;
}

3. Now I started getting those messages from Chrome 

unsafe:blob:http://localhost:8100/55df97ad-0b55-4724-8a4f-83861b87e60a:1 GET unsafe:blob:http://localhost:8100/55df97ad-0b55-4724-8a4f-83861b87e60a net::ERR_UNKNOWN_URL_SCHEME

 

So I’ve built a pipe as suggested here  in compbination with the DomSanitation suggested here :

So at last I have taken this solution :

import { Pipe } from ‘@angular/core’;

import { Pipe } from ‘@angular/core’;

import { DomSanitizer, SafeHtml, SafeStyle, SafeScript, SafeUrl, SafeResourceUrl } from ‘@angular/platform-browser’;
@Pipe({ name: ‘safe’})

export class SafePipe {
constructor(protected _sanitizer: DomSanitizer) {
}
public transform(value: string, type: string = ‘html’): SafeHtml | SafeStyle | SafeScript | SafeUrl | SafeResourceUrl {

switch (type) {

case ‘html’: return this._sanitizer.bypassSecurityTrustHtml(value);

case ‘style’: return this._sanitizer.bypassSecurityTrustStyle(value);

case ‘script’: return this._sanitizer.bypassSecurityTrustScript(value);

case ‘url’: return this._sanitizer.bypassSecurityTrustUrl(value);

case ‘resourceUrl’:

return this._sanitizer.bypassSecurityTrustResourceUrl(value);

default: throw new Error(`Invalid safe type specified: ${type}`);

}

}
}

 

Added it to declarations in your app.module.ts with class name SafePipe .

And added the pipe on the html template

<img [src]=”company.LogoImage | safe: ‘resourceUrl'”>

And here I am – after two days without sleep I have images from the server side in my app..

   

Now it’s just about vise-versa – trying to upload those slippery brothers  🙂

Advertisements

The type ‘System.Web.Mvc.ModelClientValidationRule’ exists in both

 

The type ‘System.Web.Mvc.ModelClientValidationRule’ exists in both ‘c:\Program Files (x86)\Microsoft ASP.NET\ASP.NET MVC 3\Assemblies\System.Web.Mvc.dll’ and ‘c:\Program Files (x86)\Microsoft ASP.NET\ASP.NET Web Pages\v2.0\Assemblies\System.Web.WebPages.dll’

 

http://stackoverflow.com/questions/9471263/mvc-4-beta-side-by-side-installation-error

After installing MVC4 beta today, a few of my MVC 3 projects would not compile. (ModelClientValidationRule conflict) The fix was:

Edit

ProjectName.csproj


Change

<Reference Include="System.Web.WebPages"/>


To

<Reference Include="System.Web.WebPages, Version=1.0.0.0,
Culture=neutral, PublicKeyToken=31bf3856ad364e35, processorArchitecture=MSIL "/>

Why <% ; %> instead of <%= %> ?

 

One of the subtle things you might have noticed with the code above is that we are using a <% %> block instead of a <%= %> block when calling Html.RenderPartial().

<%= %> blocks in ASP.NET indicate that a developer wants to render a specified value (for example: <%= "Hello" %> would render "Hello").  <% %> blocks instead indicate that the developer wants to execute code, and that any rendered output within them must be done explicitly (for example: <% Response.Write("Hello") %>.

The reason we are using a <% %> block with our Html.RenderPartial code above is because the Html.RenderPartial() method doesn’t return a string, and instead outputs the content directly to the calling view template’s output stream.  It does this for performance efficiency reasons, and by doing so it avoids the need to create a (potentially very large) temporary string object.  This reduces memory usage and improves overall application throughput.

One common mistake when using Html.RenderPartial() is to forget to add a semi-colon at the end of the call when it is within a <% %> block.  For example, this code will cause a compiler error:

      <% Html.RenderPartial("DinnerForm") %>

You instead need to write:

      <% Html.RenderPartial("DinnerForm"); %>

This is because <% %> blocks are self-contained code statements, and when using C# code statements need to be terminated with a semi-colon.

 

 

source

No templates in Add Controller Mvc3–or Missing Scaffolding Options in ASP.NET MVC 3 Add Controller Dialog

 

Problem :

 

No template options are offered :

but at the lecture of E4d Eyal Vardi used the EF for  scaffolding.. so?!

 

Went to asp.net/mvc –> pressed the install

It discovered a lot of stuff that wasn’t updated so .. now I’m waiting ..

 

It took a while but after all the updates I’ve got My templates

 

That’s about it!

Upgrade to MVC2

 

Well , the problem I’ve met was moving to a new computer.

All of a sudden my development project , that has been upgraded from MVC1 to MVC2 months ago , suddenly refused to work . My new computer never had the installation of MVC1. (You can check if the GAC is familiar with MVC1)

 

I’ve got message saying that I’ve got MVC1 references in my project :

 

The stack trace was :

So I started looking for MVC1. Well after a little wild I found this :

Through Red Gate’s .Net Reflector I opened a suspicious  .dll in this mortal sin , and found out that the Mvc it references is MVC1. Also in their site it said :

Important: xVal is recommended for use only with ASP.NET MVC 1.0

If you’re using ASP.NET MVC 2.0 or later, the framework has built-in support for generating client-side validation logic directly from model metadata. You can still use xVal if you wish, but it won’t be actively developed or supported.

http://xval.codeplex.com/

My solution was