We Keep Coding

AngularJS assertion failure on SharePoint React Script Editor Webpart SPFx Webpart

I have a Microsoft SharePoint 2013 application which consists of AngularJS customized application aspx pages. The application works perfectly fine on SP13.
But now the requirement is to move to SPO Modern Teams site. To prevent a lot of SPFx re-development and time lag, I have used a React Script Editor Webpart SPFx Webpart where I can simply copy the HTML and references that are already developed and working script files.
I am facing an intermittent issue where only on the first page load, it gives the below error:
Error: [ng:areq] Argument 'FormCtrl' is not a function, got undefined
When I refresh again, everything loads properly and works fine. I am unable to troubleshoot and figure out the issue trying multiple combinations and seek for help with this community.
Below is how the application is built on SharePoint 2013 (which works fine) but intermittently when moved to SPO React Script Editor Webpart:
SharePoint aspx page in Pages library.
Content Editor WebPart with reference to text file containing HTML.
Reference to jQuery, AngularJS, etc. and custom script files in HTML.
Custom Script files as:
An App File with definition to the app that is declared in the HTML as ng-app
var app = angular.module('myApp', ['ngRoute']);
A Constants file that is used in the controller
app.constant('config', {
ListName: 'This is the name of the list'
});
A service file. All REST API calls and common methods are defined here and called from controller
app.service('DataAccessLayer', ['$http', '$q', function ($http, $q) {
this.method1(){
....
}
this.method2(){
....
}
});
The main controller file which has the functionality written:
app.controller('FormCtrl', function ($scope, config, DataAccessLayer) {});

What Url goes in $http.get call?

I have a simple page that is being served by AngulraJs application. The page has div with a value of Test.
<div id="test">Test</div>
My goal is to read this value from localhost. Basically, I am writing a plugin for an application. This application is a desktop app that has its own web server built in and plugins are written in javascript. My goal is to read the test value. The problem that I am facing though is that I get prevented by CORS.
From everything I have read (and I have been reading a lot), I need to add the Access-Control-Allow-Origin header in order for this to work. What my problem is how do I add a header with angular js for one page only.
I have found the follow SO answer: Set HTTP header for one request
I have also read a lot of documentation such as this: https://docs.angularjs.org/api/ng/service/$http
However, I am still confused with is one thing:
The url that is entered, what should it be in my case? Consider the following example, how would you write it to work for my case if the Angularjs app is sitting on www.somedomain.com and it is being called by javascript code from my localhost machine.
$http.get('what url goes here?', {
headers: {'Access-Control-Allow-Origin': '*'}
});
I also have a small sub question, with the above example, will I be overriding any of the existing headers or will it only append a new header?
EDIT:
Angularjs code serving back the page:
(function() {
'use strict';
angular
.module('App')
.controller('Test', Test);
function Test($scope, $http) {
var T = this;
T.test = test;
function test(){
return "Test";
}
}
})();
HTML
<div id="test">{{T.test()}}</div>

The header Access-Control-Allow-Origin must be set on returned header, not request header.
So config your server to return the page 'what url goes here?' to have that header return.
If you have no control over 'what url goes here?' then you have to write a proxy with your web server: webserver get that page content then return to your script.

How to serve Django for an Electron app

I'm trying to create an Electron desktop app which has a Django application at its backend. There are several tutorials and blogs which mention how this can be achieved. I've tried those and it seems to be working, however there are some issues.
One of them for me is how to server Django in this case? For me the current way of doing it creates some unwanted delay making the app slow to start...
Generally, what needs to be done to create an Django/Electron app is to package (I'm using pyInstaller)the Django app into an stand-alone executable and then bundle that into an Electron app. The question is which server should be used for this case to server Django before packaging it with pyInstaller? At the moment I'm using cherryPy as a WSGI web server to serve Django.
However - is there a better alternative knowing that this will be used in an Electron desktop app? Maybe something faster, or more suitable for this task? What is the typical way of handling Django in this case?

First of all, if you app slow to start you can create custom loading-animation template with node which you will serve until your server will be ready, in this case you BrowserWindow flag show should be setup to false, you will "show" your window with window.show() on your custom "server_ready" event. Overall logic of your app should fit in: 1) You start electron app and on load serve browser window with loading... animation, then you spawn child process in which your django app will run, here you have the "bridge" between your electron-node events and python logic, this done as follows:
let django=child_process.spawn('python', [__dirname+'/django_folder/start_server.py']);
Now variable django is your handler for communication with you django app.
You can communicate as follows:
let result_name = '';
django.stdout.on(
'data',
(data:Buffer) => {
result_name+=data.toString('utf8');
}
);
django.stdout.on(
'end',
(reasone) => {
resolve(result);
}
);
django.stderr.on( //error in python will be directed here
'data',
(buf : Buffer) => {
reject(buf.toString('utf8'));
}
);
django.stdin.write(JSON.stringify('notify your django app what you need from it'));
In python:
args=sys.stdin.readlines()[0] #your message in json from electron
args=json.loads(args)['data']
print result #send data back to electron
If your app is not very complex you probably can run in on localhost,
so then your python process will notify you through event that it is ready you can reload BrowserWindow with localhost url and start to coordinate interaction communicating with child process.

Meteorjs load html script resource in template (not in body)

I am using the jsplumbtoolkit framework in order to load in several script html templates into my meteorjs application in order to create the appropriate divs/dialogues options necessary as a part of the api. After some troubleshooting I determined the issue seemed to be that Meteorjs was not loading my html script through the onRendered function that I supplied it with.
To give you a better idea of the problem
//Due to Meteorjs not able to load scripts directly in the template, I added the script load to my onRendered function in my template js
Template.mytemplate.onRendered(function(){
$(document).ready(function() {
var script = document.createElement("script");
script.type="text/x-jtk-templates";
script.src = "templates/workflowtemplate.html";
$("#rulesscripttemplate").replaceWith(script);
});
})
workflowtemplate.html is in the appropriate meteorjs directory /public/templates/workflowtemplate.html and I am assuming the directory is correct.
This is properly loaded when I check my client Mozilla developer kit as well
<script type="text/x-jtk-templates" src="templates/templaterulesworkflow.html"></script>
Is there a better way to confirm that this resource was infact loaded to the client through mozilla?

Figured it out. had to add the <script type="text/x-jtk-templates" src="templates/templaterulesworkflow.html"></script> to the tag of my application. That resolved the issue.

Shopify App - Using Script Tags with Ruby on Rails Application

I'm trying to familiarize myself with the concept of using script tags. I'm making a ruby on rails app that does something as simple as alert "Hi" when a customer visits a page. I am testing this public app on a local server and I have the shopify_app gem installed. The app has been authenticated and I have access to the store's data. I've viewed the Shopify API documentation on using script tags and I've looked at the Shopify Embedded App example that Shopify has on GitHub. The documentation details the properties of a script tag and gives examples of script tags with their properties defined, but doesn't say anything about where to place the script tag in an application, or how to configure an environment so that the js file in the script tag will go through.
I've discovered that a js file being added with a script tag will only work if the js file is hosted online, so I've uploaded the js file to google drive. I have the code for the script tag in the index action of my HomeController (the default page for the app). This is the code I'm using:
def index
if response = request.env['omniauth.auth']
sess = ShopifyAPI::Session.new(params[:shop], response[:credentials][:token])
session[:shopify] = sess
ShopifyAPI::Base.activate_session(sess)
ShopifyAPI::ScriptTag.create(
:event => "onload",
:src => "https://drive.google.com/..."
)
end
I think the problem may be tied to the request.env. The response is not being read as request.env[omniauth.auth] and I believe that the response coming back as valid may be required for the script tag to go through.
The method that I tried above is from the 2nd answer given in this topic: How to develop rails app for shopify with ScriptTags.
The first answer suggested using this code:
ShopifyAPI::Base.site = token
s = ShopifyAPI::ScriptTag.create(:events => "onload",:src => "your javascript url")
However, it doesn't say where to place both lines of code in a rails application. I tried putting the second line in a js file in my rails application, but it did not work.
I don't know if I'm encountering problems because I'm running the app on a local server or if there is something missing from the configuration of my application.
I'd appreciate it if anyone could point me in the right direction.

Try putting something like this in config/initializers/shopify_app.rb
ShopifyApp.configure do |config|
config.api_key = "xxx-xxxx-xxx-xxx"
config.secret = "xxx-xxxx-xxx-xxx"
config.scope = "read_orders, read_products"
config.embedded_app = true
config.scripttags = [
{event:'onload', src: 'https://yourdomain.herokuapp.com/javascripts/yourjs.js'}
]
end
Yes, you are correct that you'll need the js file you want to include for your script tag publicly available - if you are using localhost for development look into ngrok.
Do yourself the favor of ensuring your callbacks use SSL when interacting with the Shopify API (i.e. configure your app with https://localhost/ as a callback setting in the Shopify app settings). I went through the trouble of configuring thin as the web server locally with a self-signed SSL certificate.
With a proper set up you should be able to debug why the response is failing the omniauth check.
I'm new to the Shopify API(s), but not Rails. Their documentation leaves a lot to be desired.
Good luck to you sir,