search

ionic-team / ionic-cli

The Ionic command-line interface
MIT License
2k stars 644 forks source link

ionic resources: Unable to generate images due to an error Invalid upload: unable to read uploaded image #1688

Closed kovack closed 7 years ago

kovack commented 7 years ago

ionic resources

Ionic icon and splash screen resources generator uploading icon.png... uploading splash.png... splash.png (2208x2208) upload complete Unable to generate images due to an error Invalid upload: unable to read uploaded image

------------------- my system information :

ionic info Your system information: ordova CLI: 6.3.1 Ionic Framework Version: 2.0.0-rc.3 Ionic CLI Version: 2.1.12 Ionic App Lib Version: 2.1.7 Ionic App Scripts Version: 0.0.45 ios-deploy version: Not installed ios-sim version: Not installed OS: Windows 10 Node Version: v6.9.1 Xcode version: Not installed

fedesardo commented 7 years ago

I am facing the same issue with :

Cordova CLI: 6.4.0 Ionic Framework Version: 2.0.0-rc.3 Ionic CLI Version: 2.1.12 Ionic App Lib Version: 2.1.7 Ionic App Scripts Version: 0.0.45 ios-deploy version: Not installed ios-sim version: Not installed OS: Windows 10 Node Version: v6.9.1 Xcode version: Not installed

hexencoded commented 7 years ago

I have a similar problem::

Ionic icon and splash screen resources generator uploading icon.png... uploading splash.png... icon.png (192x192) upload complete Unable to generate images due to an error Failed to upload source image: Error: write ECONNRESET

ordova CLI: 6.4.0 Ionic Framework Version: 2.0.0-rc.1 Ionic CLI Version: 2.1.12 Ionic App Lib Version: 2.1.7 Ionic App Scripts Version: 0.0.36 ios-deploy version: Not installed ios-sim version: Not installed OS: Windows 10 Node Version: v7.1.0 Xcode version: Not installed

finalxcode commented 7 years ago

i have a similar problem:

ionic resources

Ionic icon and splash screen resources generator uploading android/icon.png... uploading android/splash.png... Unable to generate images due to an error Invalid upload: unable to read uploaded image android/splash.png (2208x2208) upload complete

ordova CLI: 6.3.1 Ionic Framework Version: 2.0.0-rc.3 Ionic CLI Version: 2.1.13 Ionic App Lib Version: 2.1.7 Ionic App Scripts Version: 0.0.45 ios-deploy version: Not installed ios-sim version: Not installed OS: Windows 10 Node Version: v6.4.0 Xcode version: Not installed

Majorhe commented 7 years ago

+1

ubaidazad commented 7 years ago

Having same problem

Ionic icon and splash screen resources generator uploading icon.png... uploading splash.png...

Unable to generate images due to an error Invalid upload: <!DOCTYPE html>
<!--[if lt IE 7]> <html class="no-js ie6 oldie" lang="en-US"> <![endif]-->
<!--[if IE 7]>    <html class="no-js ie7 oldie" lang="en-US"> <![endif]-->
<!--[if IE 8]>    <html class="no-js ie8 oldie" lang="en-US"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang="en-US"> <!--<![endif]-->
<head>
<title>Attention Required! | CloudFlare</title>
<meta charset="UTF-8" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1" />
<meta name="robots" content="noindex, nofollow" />
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1" />
<link rel="stylesheet" id="cf_styles-css" href="/cdn-cgi/styles/cf.errors.css" type="text/css" media="screen,projection" />
<!--[if lt IE 9]><link rel="stylesheet" id='cf_styles-ie-css' href="/cdn-cgi/styles/cf.errors.ie.css" type="text/css" media="screen,projection" /><![endif]-->
<style type="text/css">body{margin:0;padding:0}</style>
<!--[if lte IE 9]><script type="text/javascript" src="/cdn-cgi/scripts/jquery.min.js"></script><![endif]-->
<!--[if gte IE 10]><!--><script type="text/javascript" src="/cdn-cgi/scripts/zepto.min.js"></script><!--<![endif]-->
<script type="text/javascript" src="/cdn-cgi/scripts/cf.common.js"></script>

</head>
<body>
  <div id="cf-wrapper">
    <div class="cf-alert cf-alert-error cf-cookie-error" id="cookie-alert" data-translate="enable_cookies">Please enable cookies.</div>
    <div id="cf-error-details" class="cf-error-details-wrapper">
      <div class="cf-wrapper cf-header cf-error-overview">
        <h1 data-translate="challenge_headline">One more step</h1>
        <h2 class="cf-subheadline"><span data-translate="complete_sec_check">Please complete the security check to access</span> res.ionic.io</h2>
      </div><!-- /.header -->

      <div class="cf-section cf-highlight cf-captcha-container">
        <div class="cf-wrapper">
          <div class="cf-columns two">
            <div class="cf-column">
              <div class="cf-highlight-inverse cf-form-stacked">
                <form class="challenge-form" id="challenge-form" action="/cdn-cgi/l/chk_captcha" method="get">
  <script type="text/javascript" src="/cdn-cgi/scripts/cf.challenge.js" data-type="normal"  data-ray="3086437c041f2f1d" async data-sitekey="6LfOYgoTAAAAAInWDVTLSc8Yibqp-c9DaLimzNGM" data-stoken="urFaI2UjzL7Q4gf4a-aeCNRQ6UwJu8Ob5SoP3MOJFQIxhuAegJvnicPkjbipxu2qjQX5feWTw0hPq048mel96sBIWJe8-t7OSzWprZGpfak"></script>
  <div class="g-recaptcha"></div>
  <noscript id="cf-captcha-bookmark" class="cf-captcha-info">
    <div><div style="width: 302px">
      <div>
        <iframe src="https://www.google.com/recaptcha/api/fallback?k=6LfOYgoTAAAAAInWDVTLSc8Yibqp-c9DaLimzNGM&stoken=urFaI2UjzL7Q4gf4a-aeCNRQ6UwJu8Ob5SoP3MOJFQIxhuAegJvnicPkjbipxu2qjQX5feWTw0hPq048mel96sBIWJe8-t7OSzWprZGpfak" frameborder="0" scrolling="no" style="width: 302px; height:422px; border-style: none;"></iframe>
      </div>
      <div style="width: 300px; border-style: none; bottom: 12px; left: 25px; margin: 0px; padding: 0px; right: 25px; background: #f9f9f9; border: 1px solid #c1c1c1; border-radius: 3px;">
        <textarea id="g-recaptcha-response" name="g-recaptcha-response" class="g-recaptcha-response" style="width: 250px; height: 40px; border: 1px solid #c1c1c1; margin: 10px 25px; padding: 0px; resize: none;"></textarea>
        <input type="submit" value="Submit"></input>
      </div>
    </div></div>
  </noscript>
</form>

              </div>
            </div>

            <div class="cf-column">
              <div class="cf-screenshot-container">

                <span class="cf-no-screenshot"></span>

              </div>
            </div>
          </div><!-- /.columns -->
        </div>
      </div><!-- /.captcha-container -->

      <div class="cf-section cf-wrapper">
        <div class="cf-columns two">
          <div class="cf-column">
            <h2 data-translate="why_captcha_headline">Why do I have to complete a CAPTCHA?</h2>

            <p data-translate="why_captcha_detail">Completing the CAPTCHA proves you are a human and gives you temporary access to the web property.</p>
          </div>

          <div class="cf-column">
            <h2 data-translate="resolve_captcha_headline">What can I do to prevent this in the future?</h2>

            <p data-translate="resolve_captcha_antivirus">If you are on a personal connection, like at home, you can run an anti-virus scan on your device to make sure it is not infected with malware.</p>

            <p data-translate="resolve_captcha_network">If you are at an office or shared network, you can ask the network administrator to run a scan across the network looking for misconfigured or infected devices.</p>
          </div>
        </div>
      </div><!-- /.section -->

      <div class="cf-error-footer cf-wrapper">
  <p>
    <span class="cf-footer-item">CloudFlare Ray ID: <strong>3086437c041f2f1d</strong></span>
    <span class="cf-footer-separator">&bull;</span>
    <span class="cf-footer-item"><span data-translate="your_ip">Your IP</span>: 103.196.53.6</span>
    <span class="cf-footer-separator">&bull;</span>
    <span class="cf-footer-item"><span data-translate="performance_security_by">Performance &amp; security by</span> <a data-orig-proto="https" data-orig-ref="www.cloudflare.com/5xx-error-landing?utm_source=error_footer" id="brand_link" target="_blank">CloudFlare</a></span>

  </p>
</div><!-- /.error-footer -->

    </div><!-- /#cf-error-details -->
  </div><!-- /#cf-wrapper -->

  <script type="text/javascript">
  window._cf_translation = {};

</script>

</body>
</html>
arindamINT commented 7 years ago

Any solution guys????

kovack commented 7 years ago

started new project today and now it works ... do not know why, however I close issue

saschaludwig commented 7 years ago

I still have the problem here:

$ ionic resources --icon
Ionic icon resources generator
 uploading icon.ai...
icon.ai (vector image) upload complete
 generating icon ios icon-small@3x.png (87x87)...
 generating icon ios icon-small@2x.png (58x58)...
 generating icon ios icon-small.png (29x29)...
icon ios icon-small.png (29x29) generated
 generating icon ios icon-83.5@2x.png (167x167)...
icon ios icon-small@3x.png (87x87) generated
 generating icon ios icon-76@2x.png (152x152)...
icon ios icon-small@2x.png (58x58) generated
 generating icon ios icon-76.png (76x76)...
(node:88322) DeprecationWarning: Calling an asynchronous function without callback is deprecated.
Unable to generate images due to an error Failed to generate image: Error: read ECONNRESET
(node:88322) DeprecationWarning: Calling an asynchronous function without callback is deprecated.
(node:88322) DeprecationWarning: Calling an asynchronous function without callback is deprecated.
$ ionic info

Your system information:

Cordova CLI: 6.4.0 
Ionic Framework Version: 2.0.0-rc.3
Ionic CLI Version: 2.1.14
Ionic App Lib Version: 2.1.7
Ionic App Scripts Version: 0.0.45
ios-deploy version: 1.9.0 
ios-sim version: 5.0.12 
OS: macOS Sierra
Node Version: v7.2.0
Xcode version: Xcode 8.1 Build version 8B62
jorisw commented 7 years ago

I got this error because I saved my icon.png and splash.png files as JPEG, but with a .png file extension.

lekeutch commented 7 years ago

@ubaidazad Your problem doesn't find to Ionic but on your used device (computer). the web page which appears in the error message is the One More Step Page to protect CDN server. Your computer is infected. You must install an anti-virus or anti-malware to erase the malware. As Anti-virus for MAC: Avast Security Free, As Anti-Malware for MAC: Malwarebytes ANTI-MALWARE. I had this problem and that works now.

ubaidazad commented 7 years ago

@lekeutch I figured out, It was a DNS problem.

evertonPSenai commented 7 years ago

I saved image to png, don't work change in F2 extension file. Go: Edit(Paint, Gimp, PS), Save as "splash.png", work for me :D

Jonexuan commented 7 years ago

@evertonPSenai Resave the image works for me,thanks a lot

GerardoDRM commented 7 years ago

I figured out that image dimensions matters, I tried the minimum for both (192x192px)-icon, and (2208x2208px)-splash.

ejalee commented 7 years ago

Minimum icon and splash resolutions @ 192x192pixels and 2208x2208pixels respectively worked for me as well.

gunjank commented 7 years ago

My icon @ 512x512pixels and splash resolutions @2208x2208pixels respectively. Both images created in photoshop and saved as PNG so no manual extension changes. Error I am getting : Ionic icon and splash screen resources generator uploading icon.png... uploading splash.png... Unable to generate images due to an error Invalid upload: unable to read uploaded image

Retried again by saving png as 24 bit solved the problem. In short save as png from photoshop didn't work where save for web and select png 24 works for me .

leroygumede commented 7 years ago

I had to run each image seporately

ionic resources --splash

ionic resources --icon

dizawish commented 7 years ago

I used Photoshop to create the splash.png. I used "interlace" and i got the error. I removed "interlace" and command worked fine.

alexoragz commented 7 years ago

In my case the files were read only. I removed the read only flag and it started working again.

genox commented 7 years ago

https://github.com/driftyco/ionic-cli/issues/1948

This is not limited to client issues, issues might be linked.

ahmedSeleem1 commented 7 years ago

I am facing the same issue But i find solution "The Icon must be transparency". Try to save icon for web by Photoshop and make sure "Transparency" is checked.

FrancescoMussi commented 7 years ago

I have been trying all the solutions found here and somewhere else - and none worked for me. Then I just wait some 15 minutes and try again and all worked perfectly. I suggest you try the same - maybe it is just a temporary server issue.

gerhardcit commented 7 years ago

This issue still persists:

Your system information:

Cordova CLI: 6.5.0
Ionic CLI Version: 2.2.2
Ionic App Lib Version: 2.2.1
ios-deploy version: 1.9.0
ios-sim version: 5.0.13
OS: macOS Sierra
Node Version: v6.10.1
Xcode version: Xcode 8.3.2 Build version 8E2002

Has the ionic guys all checked out and moved on? Surely there are enough Ionic 1 projects around please?

genox commented 7 years ago

This is not a version specific issue. Ionic CLI is independent from the Ionic JS libraries used on the app (methinks). Got the error on V1 projects but also on V2 projects. And both times, my crappy uplink at the time was the problem (3G link).

When I had this issue, as soon as I moved to a stable network connection (ethernet), all went from crazy to fine. My guess is that ionic CLI's mechanism for retrieving images from the service on the web allows for no error tolerance in the transmission of files. None. Zero. No retries, no error handling. That is the root of the problem and it is a fringe issue. As such, it's probably not their highest priority. I smell "rewrite"..

Check for anomalies like packet loss, high ping, trace route.. things like that. It might provide more insight into your issue.

jwiesmann commented 7 years ago

I had the same issue today, similar to the solution with photoshop i am using pixelmator which has a (kind of hidden) feature to export the images for web as well. You can find it under Share > Export for Web After doing that it worked fine for me!

screen shot 2017-05-09 at 11 12 45
gerhardcit commented 7 years ago

I asked my designer to NOT export the PNGs with an interlace setting, and that makes a differences. Maybe Ionic can check for interlace and give better errors back. This relates to ver 1 and 2.

jnewman12 commented 7 years ago

I had this same problem on OSX. for me the issue was i modified my image in preview which seems to change the image extension to .jpeg. Manually changing it to .png did not work for me, and that seemed to be my problem. I used a service to convert back to .png and then ran ionic resources and it works just fine

abudayah commented 6 years ago

after re-exporting with interlacing turned off ionic accepted the file fine.

https://stackoverflow.com/a/31399846/568151

Adrican commented 6 years ago

I had the same problem, and it was because I change the name of the .png on the resources folder. First, name each file to "icon.png" "splash.png" and then move them to the resources folder. Finally it will work with the command "ionic cordova resources"

pbreuss commented 6 years ago

I had the same problem because the splash.png was not squared!! width and height must be the same...

masoumiaa commented 6 years ago

I had the same problem, I just switched to another Wifi and It works. (DNS problem)

rafaelzuckerberg commented 6 years ago

@leroygumede thanks work to me, when I especify icon or splash, then worked thanks

failpunk commented 6 years ago

This doesn't work at all for me. Very brittle.

Brendan92 commented 5 years ago

Problem with png icon, ionic expects icon.png without Transparency/Alpha, open icon in preview (Mac), export as png, untick Alpha and problem is gone.

mbithy commented 5 years ago

it's a size thing, make sure your icon is 1024 and splash is 2732