Related
In laravel 5.8 / axios "^0.18", "vue": "^2.5.17" app I use Maatwebsite\Excel to upload csv file
It works in case I run laravel control in GET request,
but I use axios for post requests and running request the file is not downloaded at all.
I run my request in JS code :
axios({
method: ( 'post' ),
url: this.$store.getters.apiUrl + '/personal/run-user-list-export-to-csv',
data: { user_id : user_id, user_list_id: user_list_id },
}).then((response) => {
this.showPopupMessage("User list export", "User list successfully exported !", 'success');
}).catch((error) => {
this.showPopupMessage("User list export", 'Error exporting user\'s list !', 'error');
});
with control :
public function run_user_list_export_to_csv() // http://127.0.0.1:8000/api/run-user-list-export-to-csv
{
$request= request();
...
$ret= \Excel::download(new exportSearchResults($user_list_id), 'file.csv'); // if write RETURN this line file is not downloaded anyway...
return response()->json( ['error_code' => 1, 'message' => '', 'ret' => $ret, HTTP_RESPONSE_INTERNAL_SERVER_ERROR ] );
} // public function storerun_user_list_export_to_csv(UserLisRequest $request)
I browser's responce I see output :
{"error_code":1,"message":"","ret":{"headers":{}},"0":500}
But file is not downloaded. How correctly?
Modified :
I tried to remake with sending headers in my control action, like :
public function run_user_list_export_to_csv()
{
$request= request();
...
$filename= $title.'.csv';
$download_path= $filename;
$ret= \Excel::download(new exportSearchResults($user_list_id), $download_path);
\Log::info($ret);
$headers = ['Content-Type: application/csv','Content-Disposition: attachment; filename={$filename}'];
return response($download_path, 200,$headers);
} // public function storerun_user_list_export_to_csv(UserLisRequest $request)
I see in log file output :
[2019-06-14 04:46:23] local.INFO: HTTP/1.0 200 OK
Cache-Control: public
Content-Disposition: attachment; filename="aaa Z3 iuy65 .csv"
Date: Fri, 14 Jun 2019 04:46:23 GMT
Last-Modified: Fri, 14 Jun 2019 04:46:23 GMT
But no file is downloaded.
Which is the right way ?
Modified 2 :
1) I generate csv file but failed to download it in browser's download method. This way seemed preferable to me.
But I can move generated csv file to some directory(say /home/user/ ) and to open it in client's csv app.
2) How can I with vue js to define name of current user and his download directory (bearing in mind that clients can have different OS)
Modified 3 :
I found this https://github.com/ynishi/vuecsv plugin and tried to install it.
$ npm install ynishi/vuecsv
> core-js#2.6.9 postinstall /mnt/_work_sdb8/wwwroot/lar/wiznext/msg-laravel-application/node_modules/core-js
> node scripts/postinstall || echo "ignore"
Thank you for using core-js ( https://github.com/zloirock/core-js ) for polyfilling JavaScript standard library!
The project needs your help! Please consider supporting of core-js on Open Collective or Patreon:
> https://opencollective.com/core-js
> https://www.patreon.com/zloirock
Also, the author of core-js ( https://github.com/zloirock ) is looking for a good job -)
> bootstrap-vue#1.5.1 postinstall /mnt/_work_sdb8/wwwroot/lar/wiznext/msg-laravel-application/node_modules/bootstrap-vue
> opencollective postinstall || exit 0
Thanks for installing bootstrap-vue
Please consider donating to our open collective
to help us maintain this package.
Number of contributors: 227
Number of backers: 31
Annual budget: $774
Current balance: $1,190
Donate: https://opencollective.com/bootstrap-vue/donate
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents#1.2.9 (node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents#1.2.9: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})
+ vuecsv#0.0.10
added 44 packages from 32 contributors and audited 17038 packages in 87.476s
found 1 high severity vulnerability
run `npm audit fix` to fix them, or `npm audit` for details
The output above was somewhat unuaual, but was it just advirtisement.
Next I run :
npm audit fix
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents#1.2.9 (node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents#1.2.9: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})
up to date in 8.632s
fixed 0 of 1 vulnerability in 17038 scanned packages
1 vulnerability required manual review and could not be updated
After that package.json :
{
"private": true,
"scripts": {
"dev": "npm run development",
"development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
"watch": "npm run development -- --watch",
"watch-poll": "npm run watch -- --watch-poll",
"hot": "cross-env NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --config=node_modules/laravel-mix/setup/webpack.config.js",
"prod": "npm run production",
"production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"
},
"devDependencies": {
"axios": "^0.18",
"bootstrap": "^4.0.0",
"cross-env": "^5.1",
"jquery": "^3.4.1",
"laravel-mix": "^4.0.7",
"lodash": "^4.17.5",
"popper.js": "^1.12",
"resolve-url-loader": "^2.3.1",
"sass": "^1.15.2",
"sass-loader": "^7.1.0",
"vue": "^2.5.17",
"vue-template-compiler": "^2.6.10"
},
"dependencies": {
"cors": "^2.8.5",
"remove": "^0.1.5",
"v-tooltip": "^2.0.2",
"vee-validate": "^2.2.5",
"vee-validate-laravel": "^1.1.0",
"vue-js-modal": "^1.3.31",
"vue-moment": "^4.0.0",
"vue-notification": "^1.3.16",
"vue-router": "^3.0.6",
"vue-select": "^3.1.0",
"vue-slider-component": "^3.0.31",
"vue2-filters": "^0.6.0",
"vuecsv": "github:ynishi/vuecsv",
"vuejs-paginate": "^2.1.0",
"vuex": "^3.1.0"
}
}
I tried to use this https://jsfiddle.net/ynishif/1ztu8x8q/ fiddle,
But I Got error referenced at my file :
app.js?dt=1560770053:2823 Uncaught ReferenceError: VueCSV is not defined
at Module../node_modules/babel-loader/lib/index.js?!./node_modules/vue-loader/lib/index.js?!./resources/js/components/Horizontal/personal/userLists/list.vue?
in /Horizontal/personal/userLists/list.vue:
<script>
...
import Vue from 'vue';
Vue.component("csv-download", VueCSV.CsvDownload)
I am very confused as VueCSV is not defined anywhere, but it works if mentioned fiddle.
What did I miss?
Modified 4 :
I tried to import vuecsv in my *.vue file and after installing of vuecsv.min.js I have
/node_modules/vuecsv/dist/vuecsv.min.js file
and in my vue file I tried to make like :
<script>
import {bus} from '../../../../app';
import appMixin from '../../../../appMixin';
//import
import VueCSV from '/vuecsv/dist/vuecsv.min.js'; // /node_modules/vuecsv/dist/vuecsv.min.js
Vue.use(VueCSV);
Vue.component("csv-download" , VueCSV.CsvDownload )
but in console I see error :
ERROR in ./resources/js/components/Horizontal/personal/userLists/list.vue?vue&type=script&lang=js& (./node_modules/babel-loader/lib??ref--4-0!./node_modules/vue-loader/lib??vue-loader-options!./resources/js/components/Horizontal/personal/userLists/list.vue?vue&type=script&lang=js&)
Module not found: Error: Can't resolve '/vuecsv/dist/vuecsv.min.js' in '/mnt/_work_sdb8/wwwroot/lar/wiznext/msg-laravel-application/resources/js/components/Horizontal/personal/userLists'
# ./resources/js/components/Horizontal/personal/userLists/list.vue?vue&type=script&lang=js& (./node_modules/babel-loader/lib??ref--4-0!./node_modules/vue-loader/lib??vue-loader-options!./resources/js/components/Horizontal/personal/userLists/list.vue?vue&type=script&lang=js&) 124:0-48 127:8-14 132:30-36
# ./resources/js/components/Horizontal/personal/userLists/list.vue?vue&type=script&lang=js&
# ./resources/js/components/Horizontal/personal/userLists/list.vue
# ./resources/js/routes.js
# ./resources/js/app.js
# multi ./resources/js/app.js ./resources/sass/Horizontal/app.scss ./resources/sass/Horizontal/style_lg.scss ./resources/sass/Horizontal/style_md.scss ./resources/sass/Horizontal/style_sm.scss ./resources/sass/Horizontal/style_xs_320.scss ./resources/sass/Horizontal/style_xs_480.scss ./resources/sass/Horizontal/style_xs_600.scss
If i modify import line as :
import VueCSV from 'vuecsv'; // /node_modules/vuecsv/dist/vuecsv.min.js
I see error in npm console :
This dependency was not found:
* Vue in ./node_modules/vuecsv/dist/vuecsv.min.js
To install it, you can run: npm install --save Vue
sure I have vue installed.
Which way is right?
Can it be that this plugin is not working at? Can you propose similar ?
To upload file with axios :
const config = {
headers: {
"content-type": "multipart/form-data",
"Access-Control-Allow-Origin": "*"
}
};
axios.post(ROOT+'/image/upload',data,config);
Your laravel route :
Route::post('/image/upload','API\ImageController#upload');
Your ImageController :
public function upload(Request $request)
{
$file = $request->file('image');
i have created a ne node project, i have installed a lot of modules and create the first index.js file
package.json
{
"name": "parser-test",
"version": "1.0.0",
"description": "parser test",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "luca bottoni",
"license": "ISC",
"dependencies": {
"node-cmd": "^3.0.0"
},
"devDependencies": {
"grunt": "^1.0.1",
"grunt-contrib-jshint": "^1.1.0",
"grunt-contrib-watch": "^1.0.0",
"grunt-exec": "^3.0.0"
}
}
index.js (it's failed, because i want see jshint message!)
console.log("test");
a={a=6};
if i send the cmd jshint index.js from project folder i see (work fine):
index.js: line 3, col 5, Expected ':' and instead saw '='.
1 error
now i want use the grunt task to check my file
Gruntfile.js
module.exports = function(grunt) {
// Project configuration.
grunt.initConfig({
pkg: grunt.file.readJSON('package.json'),
watch:{
scripts:{
files:["./*.js"],
tasks:['jshint']
}
},
jshint: {
files: ['Gruntfile.js',"index.js"]
}
});
// Load the plugin that provides the "uglify" task.
grunt.loadNpmTasks('grunt-contrib-watch');
grunt.loadNpmTasks('grunt-contrib-jshint');
// Default task(s).
grunt.registerTask('default', ['watch:scripts']);
grunt.registerTask('jshint', ['jshint']);
};
now i try use single task jshint with command grunt jshint, but the don't see any message. if i use the watch, watch task only the first time and after not check any change on file index.js.
i can not understand why the direct command jshint work, but the task grunt stay freezed
i have resolved after many test
i have turn-on verbose information on grunt command
grunt jshint --verbose and i have see infinite:
Running "jshint" task
Running "jshint" task
Running "jshint" task
Running "jshint" task
Running "jshint" task
Running "jshint" task
The register task and task in definition have the same name "jshint" and i have modified the name in grunt.registerTask('jshints', ['jshint']);
now work fine
I'm just getting started with Phoenix and Elixir, and am coming to a hurdle at the very start with my scss/css files.
Following some blogs/articles, I have done the following so far:
renamed app.css to app.scss
Created new dir '_scss' where I am putthing my scss files.
In app.scss I am importing my scss files.
#import "../_scss/_foundation.scss";
package.json looks like:
{
"repository": {},
"license": "MIT",
"scripts": {
"deploy": "brunch build --production",
"watch": "brunch watch --stdin"
},
"dependencies": {
"babel-preset-es2015": "^6.24.1",
"bourbon": "^4.3.4",
"bourbon-neat": "^2.0.0",
"foundation-sites": "^6.3.1",
"phoenix": "file:deps/phoenix",
"phoenix_html": "file:deps/phoenix_html",
"purecss": "^0.6.2",
"sass-brunch": "^2.10.4"
},
"devDependencies": {
"babel-brunch": "~6.0.0",
"brunch": "2.7.4",
"clean-css-brunch": "~2.0.0",
"css-brunch": "~2.0.0",
"javascript-brunch": "~2.0.0",
"uglify-js-brunch": "~2.0.1"
}
}
And in brunch.config.js I have:
stylesheets: {
joinTo: "css/app.scss",
order: {
after: ["web/static/css/app.scss"] // concat app.css last
}
},
I changed the above to reflect the name change of app.scss. Was that correct?
And when I load the server, the page loads, but without any styling. My terminal just seems to be constantly compiling...
24 Apr 15:01:56 - info: compiling..
What am I doing wrong here?
UPDATE
Seems to be the individual file. Int his case foundation.scss. I just tried another framework , Bulma, and it worked instantly.
I am using karma & jasmine to do unit tests, and I am trying to do my first test. I am using the first example here:
https://jasmine.github.io/1.3/introduction.html#section-Matchers
and it didn't seem to do anything, so I added some logging and tried to make it catch an error:
console.log('a');
describe("A suite", function() {
console.log('b', typeof(it));
it("contains spec with an expectation", function() {
console.log('c');
expect(true).toBe(false);
});
});
And this is what my output comes out with:
Chrome 43.0.2357 (Mac OS X 10.10.3) LOG: 'a'
Chrome 43.0.2357 (Mac OS X 10.10.3) LOG: 'b', 'function'
so it looks like nothing internal to the "it" function gets executed since 'c' is never outputted. Am I missing something?
Update
So this is the grunt task I am running:
module.exports = function (grunt) {
grunt.initConfig({
pkg: grunt.file.readJSON('package.json'),
karma: {
unit: {
configFile: 'karma.conf.js'
}
}
});
grunt.loadNpmTasks('grunt-karma');
grunt.registerTask('default', ['karma']);
};
And this is my package.json with the list of installed npm packages:
{
"name": "abc.com",
"version": "0.0.1",
"private": true,
"dependencies": {
"bcrypt": "^0.8.3",
"body-parser": "^1.0.2",
"bower": "^1.4.1",
"ejs": "^2.3.1",
"email-templates": "^2.0.0-beta.1",
"error-handler": "^0.1.4",
"errorhandler": "^1.3.6",
"express": "~4.1.1",
"express-session": "^1.11.2",
"grunt": "^0.4.5",
"jade": "~0.31.2",
"jasmine": "^2.3.1",
"jasmine-runner": "^0.2.9",
"karma": "^0.12.37",
"karma-chrome-launcher": "^0.2.0",
"karma-jasmine": "^0.3.5",
"karma-junit-reporter": "^0.2.2",
"method-override": "^1.0.0",
"morgan": "^1.0.0",
"mysql": "^2.6.2",
"nodemailer": "^1.3.4",
"protractor": "^1.1.1",
"shelljs": "^0.2.6",
"xoauth2": "^1.0.0"
},
"scripts": {
"prestart": "npm install",
"postinstall": "bower install --allow-root",
"start": "supervisor -n error app.js",
"pretest": "npm install",
"test": "karma start karma.conf.js",
"test-single-run": "karma start karma.conf.js --single-run",
"preupdate-webdriver": "npm install",
"update-webdriver": "webdriver-manager update",
"preprotractor": "npm run update-webdriver",
"protractor": "protractor e2e-tests/protractor.conf.js",
"update-index-async": "node -e \"require('shelljs/global'); sed('-i', /\\/\\/##NG_LOADER_START##[\\s\\S]*\\/\\/##NG_LOADER_END##/, '//##NG_LOADER_START##\\n' + sed(/sourceMappingURL=angular-loader.min.js.map/,'sourceMappingURL=bower_components/angular-loader/angular-loader.min.js.map','app/bower_components/angular-loader/angular-loader.min.js') + '\\n//##NG_LOADER_END##', 'app/index-async.html');\""
},
"configs": {
"client_javascript_paths": [
"public/components/common/helpers.js",
"public/libs/bower_components/html5-boilerplate/js/vendor/modernizr-2.6.2.min.js",
"public/libs/bower_components/jquery/dist/jquery.min.js",
"public/libs/bower_components/angular/angular.js",
"public/libs/bower_components/angular-route/angular-route.js",
"public/libs/bower_components/angular-resource/angular-resource.js",
"public/libs/bower_components/d3/d3.js",
"public/libs/bower_components/c3/c3.js",
"public/libs/bower_components/angular-chart/angular-chart.js",
"public/libs/bower_components/moment/moment.js",
"public/components/common/filters.js",
"public/components/notify/notify.js",
"public/components/static/static.js",
"public/components/account/account.js",
"public/components/auth/auth.js",
"public/components/formatted-table/formatted-table.js",
"public/app.js",
"public/libs/underscore.js"
]
},
"devDependencies": {
"jasmine": "^2.3.1",
"jasmine-core": "^2.3.4",
"karma": "^0.12.37",
"karma-chrome-launcher": "^0.2.0",
"karma-jasmine": "^0.3.5",
"karma-phantomjs-launcher": "^0.2.0",
"phantomjs": "^1.9.17"
}
}
And finally, this is my karma.conf.js
module.exports = function(config) {
var package = require('./package.json')
console.log(package.configs.client_javascript_paths);
config.set({
// base path that will be used to resolve all patterns (eg. files, exclude)
basePath: '',
// frameworks to use
// available frameworks: https://npmjs.org/browse/keyword/karma-adapter
frameworks: ['jasmine', 'requirejs'],
// list of files / patterns to load in the browser
files: package.configs.client_javascript_paths.concat([
'public/components/**/*.tests.js'
]),
// list of files to exclude
exclude: [
],
// preprocess matching files before serving them to the browser
// available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
preprocessors: {
},
// test results reporter to use
// possible values: 'dots', 'progress'
// available reporters: https://npmjs.org/browse/keyword/karma-reporter
reporters: ['progress'],
// web server port
port: 9876,
// enable / disable colors in the output (reporters and logs)
colors: true,
// level of logging
// possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
logLevel: config.LOG_INFO,
// enable / disable watching file and executing tests whenever any file changes
autoWatch: true,
// start these browsers
// available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
browsers: ['Chrome'],
// Continuous Integration mode
// if true, Karma captures browsers, runs the tests and exits
singleRun: false
});
};
and I just run
grunt
to start it to get the output at the top of this.
It is happening because of requirejs framework you use with karma. If you don't need it, then you could just remove it from karma.conf.js and test will work just fine. But if you actually need it, then I would suggest to look at this documentation page, explaining how to configure requirejs for karma, it actually requires an extra file.
Using the files you've presented in the question I was able to execute the tests after the following steps:
first create a backup of karma.conf.js
use CLI command karma init to reinitiate creation of karma config
on the step Do you want to use Require.js ? selected Yes
on the step Do you wanna generate a bootstrap file for RequireJS? selected Yes
copied everything from a backup and added a file that was generated by karma init, it should be called test-main.js, to the list of watched files:
module.exports = function(config) {
var package = require('./package.json');
config.set({
// ...
files: package.configs.client_javascript_paths.concat([
'public/components/**/*.tests.js',
'test-main.js', // here it is
])
// ...
});
};
I'm a bit stuck with my Jenkins setup on OSX Lion 10.7.3.
I'm using Grunt in my webapp to run Jasmine tests, build less, create cache manifest etc. Everything works on my laptop Lion 10.7.5, but on the server box grunt fails from time to time with the following error:
$ grunt less
module.js:340
throw err;
^
Error: Cannot find module ''
at Function.Module._resolveFilename (module.js:338:15)
at Function.Module._load (module.js:280:25)
at Module.require (module.js:362:17)
at require (module.js:378:17)
at ChildProcess.<anonymous> (/usr/local/lib/node_modules/grunt-cli/bin/grunt:44:3)
at ChildProcess.EventEmitter.emit (events.js:99:17)
at Process._handle.onexit (child_process.js:678:10)
This is intermittent, it fails approximately once out of five runs and is not task specific. It fails with the same rate when running grunt manifest or grunt test.
Once thing I noticed is that when it works it takes a second or two until the task starts executing, but when it fails it fails immediately.
I tried to remove node_modules, npm cache clear, reinstalling grunt-cli. Nothing works.
Here's my package.json:
{
"name": "webapp",
"version": "0.0.0",
"dependencies": {},
"devDependencies": {
"grunt": "0.4.0rc7",
"grunt-contrib-copy": "0.4.0rc7",
"grunt-contrib-concat": "0.1.2rc6",
"grunt-contrib-coffee": "0.4.0rc7",
"grunt-contrib-uglify": "0.1.1rc6",
"grunt-contrib-compass": "0.1.1rc8",
"grunt-contrib-jshint": "0.1.1rc6",
"grunt-contrib-mincss": "0.4.0rc7",
"grunt-contrib-connect": "0.1.1rc6",
"grunt-contrib-clean": "0.4.0rc6",
"grunt-contrib-htmlmin": "0.1.1rc7",
"grunt-contrib-imagemin": "0.1.1rc8",
"grunt-contrib-livereload": "0.1.0rc8",
"grunt-contrib-jasmine": "~0.3.2",
"grunt-contrib-less": "0.5.0",
"grunt-manifest": "0.4.0",
"grunt-jslint": "0.2.5",
"grunt-bower-hooks": "~0.2.0",
"grunt-usemin": "~0.1.7",
"grunt-regarde": "~0.1.1",
"grunt-requirejs": "~0.3.1",
"grunt-mocha": "~0.2.2",
"grunt-open": "~0.1.0",
"matchdep": "~0.1.1"
},
"engines": {
"node": ">=0.8.0"
}
}
npm and node versions:
$ npm -version
1.2.11
$ node --version
v0.8.20
I have now stripped down both packages.json and Gruntile.js:
$ cat package.json
{
"name": "webapp",
"version": "0.0.0",
"dependencies": {},
"devDependencies": {
"grunt": "0.4.0rc7",
"grunt-manifest": "0.4.0",
"matchdep": "~0.1.1"
},
"engines": {
"node": ">=0.8.0"
}
}
$ cat Gruntfile.js
'use strict';
module.exports = function (grunt) {
// load all grunt tasks
require('matchdep').filterDev('grunt-*').forEach(grunt.loadNpmTasks);
grunt.initConfig({
manifest: {
generate: {
options: {
basePath: 'app/',
exclude: ['js/lib/amp/com.vaultus.api.WebApiAggregated.cache.js', 'js/lib/amp/com.vaultus.api.DebugWebApiAggregated.cache.js'],
timestamp: true
},
src: [
'index-hybrid.html',
'*.xml',
'js/**/*.js',
'css/**/*.css',
'css/images/**/*',
'i18n/**/*.js',
'template/**/*.html'
],
dest: 'app/cache-manifest.mf'
}
}
});
grunt.registerTask('build', [
'manifest'
]);
grunt.registerTask('default', ['build']);
};
No luck :(
We were hitting this issue on our CI builds.
After a bit of digging it looks like this was a bug in grunt-cli 0.1.6 and has been fixed in 0.1.7 of grunt-cli.