I have a link thats used to download files from my server. The link passes svg (xml) as a paramater. THe server creates a jpeg using this xml and passes it back to the view to initiae a download.
The problem is that in IE only a portion of the xml is being passed due to the limit on url size. It works perfectly in Firefox and Chrome (where there must be bigger url limits).
The xml being passed comes from javascript so I need to update the link on the fly on the client side :
html :
<g:link class="button" action="testImage" id="my-link"><input type="button" value="PDF" class="invisible"/></g:link>
JS:
svgXML = "<svg ......</svg>" //can get very long
document.location.href= '${createLink(controller: 'imageCreater' , action:'downloadJPEG')}?svg='+svgXML;
Is there a way around this approach? I cant use ajax as it requires a plugin to initiate the download after it gets passed to the view. Due to requirements I cant use this plugin. I've read somewhere that POST requests don't have a limit on paramater size. Is there a way to change my link to do a POST rather then a GET request?
In case anyone comes across the same problem. I couldn't find a straight forward fix for my problem using a grails link. I came across the jQuery-File-Download plugin and its working perfectly
Related
I am trying to use plupload-angular-directive in my Angular SPA. The problem is, the upload URL is not a constant and is generated on the server side every time I need to upload something.
So, as mentioned in the docs I have used the pl-url directive to set the URL on the front-end like this:
<button pl-upload=""
pl-auto-upload="true"
pl-files-model="multiFiles"
pl-url="{{imgActionUrl}}"
pl-progress-model="percent">Upload Images</button>
where, the imgActionUrl is fetched by my Angular controller and assigned to the $scope.
Debugging the application clearly showed that the URL is being properly set but even then, when the upload actually happens, it makes a POST to /upload.php rather than to the address mentioned in the directive.
Why is this happening?
After a lot of digging around, I posted an issue on the github page of the project:
https://github.com/sahusoftcom/plupload-angular-directive/issues/43
But it seems nobody is maintaining this repository and the owner redirected me to another library, jQuery-File-Upload.
Our team is constantly working on an angular application, and every week or 2 we update it with new features or correct some bugs that came out.
We are using a C# backend with webservices.
QUESTION: When we update the application on the server, we sometimes (this doesn't happen all the time) get the problem that user is still seeing the old HTML and functionalities. What is the way to solve this?
I didn't find this on google, maybe I'm not looking for the right terms,
any help is appreciated.
Users have to clear their cache to get the new version of the application.
What you are seeing are cached copies of the JS files (possibly HTML partials too).
When the browser parses the HTML page, it makes the request for getting the JS resource and looks at various information before deciding to retrieve either the cached copy (if any) or whether to query the server again.
You can find some extra details on the Google fundamentals on HTTP caching
A solution I have been adopting myself is to set the cache headers to cache the file for a very long period, and then use tools in the build to version the file either on the filename or with a request parameter.
I have used grunt-cache-breaker and found it to serve well for this purpose. I know there is a gulp equivalent too
The most common way to make sure cached versions of your javascript aren't used is adding the version as a parameter in the reference to the script like so:
<script src="/app.js?v=v1.0"></script>
I have a href link which points to a file on the server but the problem is that it sometimes links to an older version of the file. To be able to access the up-to-date version, i need to clear browsing history/cache. I have tried to clear cache with php, but it doesn't help. Any idea why this is happening, and how to get rid of this problem?
You can add a param to link and force the file download.
link
Multiple ways based on scenarios
Apache Caching directives - If you are the server admin you could use apache's mod_cache to manage caching for specific file(types)
Pass the correct HTML header to the browser directing it not to cache it(its its HTML, PHP etc file where you can control the headers of the request)
Pass a randomly generated number in the end of the url like - url-to-file?1234. where 1234 is a randomly generated number(you could use timestamp also instead of the random number)
in order to make nice urls, I decide to remove the # from my ulrs using the tip from the following question Removing the fragment identifier from AngularJS urls (# symbol) Now, I realized that my urls are not working if I try a direct access to them. from the given example in the related question if put the url below directly in the browser http://localhost/phones
I'll get a 404.
Any idea how to solve this?
You need to write server side code that will generate the page that you were previously depending on the client-side JavaScript to generate.
This will then be the initial view for that URL.
If the client supports JavaScript (and the JavaScript doesn't fail for any reason) it will then take over for future interactions.
Otherwise, the regular links and forms you (should) have in the page will function as normal without JS.
I am attempting to create an end-to-end test for my application. I just performed a basic test and it is working fine.
it('should not show any criterias when the application loads initially',
function() {
expect(repeater('.new-criteria').count()).toBe(0);
});
The above test works correctly.
Now, I am using ng-repeat directive for an element. The array for this repeat increases by 1 count every time a button is clicked. Thus, I wrote the followin test:
it('should show one criteria when the user adds a criteria', function() {
element('.add-criteria').click();
expect(repeater('.new-criteria').count()).toBe(1);
});
I am using runner.html (that can be found in AngularJS end to end tutorial). When I load the page, the first test is a success. However, the second test results in the following error:
Selector .add-criteria did not match any elements.
I do have a button with the class add-criteria as follows:
<button type="button" class="btn btn-inverse add-criteria" ng-click="addNewCriteria()">
<i class="icon-plus-sign icon-white"></i>
Add a new criteria
</button>
Yet, the test fails. If I remove .add-criteria and replace it with .new-criteria, even then I get the same error. Somehow, repeater() is able to get the correct element but element() reports that the element matching the selector could not be found.
Any idea what is going wrong?
Edit : I wish to add here that I am using AngularJS with Node / Express. My directory structure is the same as the one in angular-express-seed. I found that the issue occurs because the CSS and JS files are located in the public folder while the HTML page is in the views folder. Copying the CSS and JS files to the views folder solves my problem How do I achieve this without copying to the views folder?
Angular Express Seed hasn't been updated in quite some time. It has none of the testing functionality found in the current version of angular-seed, as issue #9 on the Github page illustrates. As such, I don't know where the tests you are trying to run are coming from.
I would suggest decoupling the client-side AngularJS portion of your project from the server-side Node.js/Express portion. Use the offical angular-seed project during development. It includes a simple Node.js server that is already preconfigured for local development and testing. It simplifies things greatly.
When you want to move the AngularJS into production, serve only the files you need using whichever option is convenient for you: Apache, nginx, an Express Node.js server. Your choice. If you decide to still go with an Express solution, a quick google/SO search will provide numerous resources on the subject of serving static files and redirecting to index.html. It's been discussed before and the solutions aren't that complicated.
This answer obviously doesn't solve the issue you seem to be having, but we need more information than what you've given. If you clarify how you constructed the environment your developing in (how are you running tests when angular-express-seed doesn't include them?) then we can likely provide a solution to the routing problems you seem to be having. Directory structure, app.js code, etc., would be helpful.