OHIF viewer not displaying DICOM images from my .net core server - asp.net-core

I am currently working on a DICOM based web application, I have created my backend server using .net core and want to integrate my server with OHIF viewer. I read all the documentation of OHIF viewer and configured my default.js file and changed the routes of wadoUriRoot,qidoRoot and wadoRoot as follows
window.config = {
// default: '/'
routerBasename: '/',
extensions: [],
showStudyList: true,
filterQueryParam: false,
servers: {
dicomWeb: [
{
name: 'DCM4CHEE',
wadoUriRoot: 'http://127.0.0.1:5000',
qidoRoot: 'http://127.0.0.1:5000',
wadoRoot: 'http://127.0.0.1:5000',
qidoSupportsIncludeField: true,
imageRendering: 'wadors',
thumbnailRendering: 'wadors',
enableStudyLazyLoad: true,
},
],
}
Now when I recompile and run it, I get a totally black screen. I have checked that data is going to the browser. What are the possible reason for this behavior? How can I make my OHIF viewer to display my own Dicom images?

I finally able to solve it. It was a browser problem, Firefox and Chrome were not allowing CORS so I had to add services and UseCors to my Startup.cs in my server code to enable CORS
https://learn.microsoft.com/en-us/aspnet/core/security/cors?view=aspnetcore-3.1
There it's mentioned how to do it.

Related

How can I turn off Google fonts and Material design icons in Vuetify

I am developing an internal company app that does not reach out to the internet, therefore I can not use CDNs or Google Fonts.
In my developer console for Chrome (and not Firefox for some reason) I get errors pointing to the fact it get the following urls
https://dcn.jsdeliver.net/npm/#mdi/font#latest/materialdesignicons.min.css
and
https://fonts.googleapis.com/css?family=Roberto:100,300,400,500,700,900&display=swap
How (in nuxt/vuetify) can I turn these off?
First of all you need to set nuxtjs/vuetify to offline mode with this configuration:
{
buildModules: [
'#nuxtjs/vuetify'
],
vuetify: {
defaultAssets: false // <= this will disable autoloading Google font and MDI icons
}
}
Then you can import these icons and fonts as here.

BigCommerce Stencil Custom Page template not appearing

In Page Builder I've added a page called About Us which has the url '/about-us/'
I've been following the instructions found here
https://developer.bigcommerce.com/stencil-docs/storefront-customization/custom-templates
in order to make a custom template for that page.
I made a file called about-us.html in templates/pages/custom/page with the contents:
<h1>About Us Page Test</h1>
My .stencil file looks like the following
{
"normalStoreUrl": "my url",
"accessToken": "my access token",
"port": "3003",
"customLayouts": {
"brand": {},
"category": {},
"page": {
"about-us.html": "/about-us/"
},
"product": {}
}
}
I've stopped and reran 'stencil start' but every time I visit localhost:3003/about-us/ it just shows the normal page instead of the custom template I build.
Is there something I'm missing? Is this an issue with using the page builder in combination with stencil?
I assume you haven't set the custom template for your page yet.
Go to Web Pages and edit your About Us page then look for the Template Layout File dropdown. Your custom template should appear there if it is setup correctly.
The issue was resolved when a full system reboot was performed. I'm not sure why stopping and restarting stencil did not resolve this.

Universal Links iOS 9 - Issue

I have implemented Universal links in iOS app. It works perfectly when I put the url in external app such as "Notes" and then tap it. It opens the app.
What I want to achieve is that when someone visits a specific url of my webpage, the ios app should be launched by itself. So in order to accomplish this, I have put:
applinks:www.mydomain.com
in my entitlements.
And the following in my "apple-app-site-association" file
{
"applinks":
{
"apps": [ ],
"details":
[
{
"appID": "team_id.com.teamname.app_name",
"paths": ["/path-CompA/path-CompB/"]
}
]
}
}
But When I navigate through my website, and I reach the path mentioned in json file, it only shows the bar at top of web page saying "Open in App_name" with "Open" button on right side.
I want to know if its the default behaviour of Universal links to not open the app if user is coming from the same domain? If its not the case then how does it open the app form "Notes".
Please note that my json file is not signed but I have put it on my website which is on https.
Thanks,
A couple of things. Can you try changing your apple-app-site-association file code as such?
{
"applinks": {
"apps": [],
"details": [
{
"appID": "team_id.com.teamname.app_name",
"paths": [
"*",
"/"
]
}
]
}
}
You can check your format with this validation tool: https://search.developer.apple.com/appsearch-validation-tool/
The answer is that basically, this behavior is expected as of iOS9.2, with Universal links. Universal links only work from a different domain.
With Branch (https://branch.io/), you can use one domain for links (bnc.lt), so that when you (as a developer using branch) host universal links on your site, they still operate as expected.
Also, for universal links from other domains (not to the same domain), you can 'unbreak' the safari redirect behavior by long-pressing on the link from an application and choosing 'Open in «App»'. I hope this helps!

Simply cannot make SignalR (asp.net mvc4) and require.js work together

I've seen similar posts around the web and nothing anyone has suggested works for me. I'm really faced with the choice of dumping one or the other it seems at this point.
This "Getting Started with SignalR and MVC 4 tutorial":
http://www.asp.net/signalr/overview/getting-started/tutorial-getting-started-with-signalr-and-mvc-4
says you need two script includes to make signalR work:
<!--Reference the SignalR library. -->
<script src="~/Scripts/jquery.signalR-1.0.1.js"></script>
<!--Reference the autogenerated SignalR hub script. -->
<script src="~/signalr/hubs"></script>
I'm at a loss as to how to make the second one, the autogenerated SignalR hub script, happen in require.js. Unless I'm missing something there just doesn't seem to be a viable require.js syntax for inclusion of autogenerated scripts. Without it you get this error at line 159 of jquery.signalR-1.1.2.js:
"JavaScript runtime error: SignalR: Error loading hubs. Ensure your hubs reference is correct, e.g. "
The code at that point in jquery.signalR is doing this:
signalR.hub = {
start: function () {
// This will get replaced with the real hub connection start method when hubs is referenced correctly
throw new Error("SignalR: Error loading hubs. Ensure your hubs reference is correct, e.g. <script src='/signalr/hubs'></script>.");
}
};
Has anyone actually made this autogenerated script thing happen via require.js?
Been studying this a bit more. Let me add some detail:
I'm using this approach - Structuring scalable client side applications: (http://johndavidmathis.wordpress.com/2013/04/23/structuring-scalable-client-side-applications/) to make a more scalable structure. Second part in that series "Permit modules to utilize multiple files and a logical folder structure" http://johndavidmathis.wordpress.com/2013/04/23/structuring-scalable-client-side-applications/ has me splitting my actual signalr code out into a separate Marionette chat module (separate from my main app.js file) to achieve a better file structure. I really like this approach. The rest of my project is set up like this now and it really is showing benefits when it comes to finding code. I think that extra split is where I'm stuck. Can't seem to get that second dependency, the autogenerated script, into that separate chat module file. I'm still studying this but it looks like this to me at this point. require.js gets the dependency into my Marionette app:
require(["marionette","handlebars", "signalr", "signalr.hubs"], function (Marionette) {
window.App = new Marionette.Application();
App.addRegions({
headerRegion: "#header",
contentRegion: "#content",
footerRegion: "#footer",
});
require(["modules/main/loader", "modules/chat/loader"], function () {
App.start();
});
})
If I want chat that dependency to make its way further into the app, into the chat module in another file?
Something like?
define(dependencies,
function () {
App.module("ChatModule", function (ChatModule, App, Backbone, Marionette, $, _, "signalr.hubs", "signalr.hubs") {
// SignalR Proxy created on the fly
var chat = $.connection.chatHub;
// Start the connection
$.connection.hub.start();
//more chat code...
An update:
The answer below does work in my dev environment. But it does not work when I publish the code to a real production server.
When the code is published to a real production server (IIS 6.1 on Windows Server Enterprise 2008 R2) the browser console once again shows a "404" for the autogenerated reference.
Specifically, the console shows the "?" is being added into the reference path before ".js", like this...
http://mydomain.com/myapp/Scripts/application/signalr/hubs?.js...
Tried taking the "?" out but then it removes my app name from the path, like this...
http://mydomain.com/signalr/hubs.js.
I think what would get me there is the first one, without the "?", like...
http://mydomain.com/myapp/Scripts/application/signalr/hubs.js
I'm just not seeing how to make that happen.
FINAL UPDATE:
Final piece of the puzzle for production server is the site's virtual directory. Here's final code that worked for me. Thanks Raciel R for your help:
requirejs.config({
paths: {
//core
"jquery": "jquery-1.9.1",
"signalr": "jquery.signalR-1.1.2",
"signalr.hubs": "/productionservervirtualdirectory/signalr/hubs?"
},
shim: {
"jquery": {exports: "$"},
"signalr": { deps: ["jquery"] },
"signalr.hubs": { deps: ["signalr"] }
});
//Then all you have to do is to make signalr.hubs required in your modules. Ie:
require(["signalr.hubs"], function(){
//your code here
});
requirejs.config({
paths: {
//core
"jquery": "jquery-1.9.1",
"signalr": "jquery.signalR-1.1.2",
"signalr.hubs": "/signalr/hubs?"
},
shim: {
"jquery": {exports: "$"},
"signalr": { deps: ["jquery"] },
"signalr.hubs": { deps: ["signalr"] }
});
Then all you have to do is to make signalr.hubs required in your modules. Ie:
require(["signalr.hubs"], function(){
//your code here
});
I set up RequireJS successfully using #raciel-r's solution but I was still having problems with other JavaScript modules like karma that were also confused by the dynamic proxy. I converted the signalr proxy to a static file and used that with RequireJS instead:
Import Microsoft.AspNet.SignalR.Utils
Run packages/Microsoft.AspNet.SignalR.Utils.2.X.X/tools/signalr.exe
ghp /path:my/bin /o:path/to/scripts/server.js where /my/bin is the directory containing the assemblies with your SignalR Hubs.
Replace your reference in to /signalr/hubs with server:
requirejs.config({
paths: {
// ...
"signalr.hubs": "path/to/scripts/server"
},
// ....
If you are using the convenience methods of the generated proxy, you will also have to rewrite them (see How to create a physical file for the SignalR generated proxy)

flowplayer streaming mp4 from apache

I'm having some problems getting this to work. I think I've done it right based on http://flowplayer.org/forum/5/14664#post-14830). The clip starts to play fine, but when I skip to a part of the clip which hasn't loaded yet it just goes back to the start of the file/video
Sadly the browser used is IE6 for the most part :(
Apache 2 running on Redhat
I've created an mp4 file with ffmpeg.
Run qt-faststart 1.mp4 1.qt.mp4
Installed mod_flvx.c
Added:
LoadModule flvx_module modules/mod_flvx.so
AddHandler flv-stream .flv
To Apache httpd.conf
Using the example page:
<script type="text/javascript">
flowplayer("player", "flash/flowplayer-3.0.3.swf", {
clip: {
url: 'http://servername/player/media/1.qt.mp4',
// default provider: 'h264streaming'
provider: flashembed.isSupported([9, 115]) ? 'h264streaming' : 'lighttpd',
scaling: 'fit',
autoBuffering: true,
autoplay: false,
bufferLength: 3
},
log: {
level: 'debug'
},
plugins: {
h264streaming: {
url: 'flash/flowplayer.h264streaming-3.0.5.swf'
},
controls: {
url: 'flash/flowplayer.controls-3.0.3.swf',
// which buttons are visible and which not ?
play:false,
fullscreen:true,
// scrubber is a well known nickname to the timeline/playhead combination
scrubber: true
}
}
});
</script>
Anyone have any suggestions?
Thanks
First off, you need to see if your apache is configured to correctly seek to parts of the video. You can do that by passing a get parameter like my_vide_path.mp4?start=10 to have it start 10 seconds in. If it successfully starts 10 seconds in, then apache is set up correctly and you need to make flowplayer work. If apache isn't set up correctly, then even the correct flowplayer config won't help.
I doubt your apache is set up correctly though. You're telling apache to handle .flv files and yet you're using mp4s.
I've successfully gotten this to work with the apache module from http://h264.code-shop.com/trac/wiki.
You'll need to add and load the module into apache and tell apache to handle .mp4 files with it.
Next step would be to test with that get parameter ?start=10 to see if it is seeking correctly.
After that, all you need to do is:
<script type="text/javascript">
flowplayer("player", "flash/flowplayer-3.0.3.swf", {
clip: {
url: 'http://servername/player/media/1.qt.mp4',
default provider: 'h264streaming'
},
plugins: {
h264streaming: {
url: 'flash/flowplayer.h264streaming-3.0.5.swf'
}
}
});
</script>
I used the updated flowplayer swf and instead of h264's swf, the flowplayer plugin for psuedostreaming, as it works with the newer version of flowplayer and apparently the h264 one didnt.